<template>
  <a-popconfirm
    :title="confirmText"
    placement="top"
    @confirm="onConfirm"
  >
    <a-button
      class="confirm-button"
      type="link"
      small
      v-bind="$attrs"
    >
      <slot>{{ text }}</slot>
    </a-button>
  </a-popconfirm>
</template>

<script lang="ts">
export default {
  inheritAttrs: false
}
</script>

<script setup lang="ts">
const props = withDefaults(
  defineProps<{
    title?: string;
    text?: string;
    type?: 'default' | 'danger' | 'primary' | 'warning' | 'danger';
  }>(),
  {
    title: '确定删除吗?',
    type: 'danger',
    text: ''
  }
);

const confirmText = computed(() => {
  if (props.text) {
    return `确定${props.text}吗?`;
  }
  return props.title;
});
const emit = defineEmits(['click']);
function onConfirm() {
  emit('click');
}
</script>

<style lang="less">
.confirm-button {
  border: none;
  height: 22px;
  line-height: 22px;
  padding: 0;
}
</style>
